<template>
	<view class="bottomContent">
		<view class="bottom_nav_wrap">
			<view v-for="(item,index) in Attbottoms" :key="index">
				<view @click="bottomSkip(item)">
					<view class="bottom_nav_content">
						<view class="bottom-nav-text "
							:class="[{'select-color':(bottomNavName==item.name)},item.icon,]"></view>
						<text class="bottom_nav_font_cancel"
							:class="[{'select-color':(bottomNavName==item.name)}]">{{item.text}}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		name: "my-bottomss",
		// props:['topName','userName','bottomArr','bottomName','classId'],
		props: {
			bottomArr: Array,
			topName: String,
			userName: String,
			bottomName: String,
			classId: String,
			isDuty: String,
			Attbottoms: Array,
		},
		data() {
			return {
				index: 1,
				bottomsData: [],
				// Attbottoms:[ {
				//                 name:'home',
				//                 icon:'iconfont icon-yonghutongji',
				//                 text:"首页",
				//                 path: '/pages/classManagement/classManagementIndex'
				//             },

				// {
				//     name:'maintenance',
				//     icon:'iconfont icon-shezhi',
				//     text:"退出",
				//     path: '/pages/index/login'
				// },
				// ],
				bottomNavName: 'home',
				MagBottoms: [{
						name: 'home',
						icon: 'iconfont icon-yonghutongji',
						text: "首页",
						path: '/pages/index/supervisorIndex'
					},
					{
						name: 'home',
						icon: 'iconfont icon-yonghutongji',
						text: "首页",
						path: '/pages/index/supervisorIndex'
					},
					{
						name: 'home',
						icon: 'iconfont icon-yonghutongji',
						text: "首页",
						path: '/pages/index/supervisorIndex'
					},
				]

			}


		},
		mounted() {
			if (this.bottomArr && this.bottomArr.length > 0) {
				this.Attbottoms = this.bottomArr
			}
			if (this.bottomName) {
				this.bottomNavName = this.bottomName
			}
			// console.log(this.$attrs,"bottom")
		},

		methods: {
			bottomSkip(item) {
				this.bottomNavName = item.name;

				if (item.text == '退出') {
					uni.reLaunch({
						url: '/pages/index/login'
					})
					return;
				}

				if (item.name == 'moring' || item.name == 'moon' || item.name == 'night') {
					if (this.isDuty) {
						uni.navigateTo({
							url: `${item.path}?classId=${this.classId}&className=${this.topName}&type=duty`,
							success: res => {},
							fail: () => {},
							complete: () => {}
						})
					} else {
						uni.navigateTo({
							url: `${item.path}?classId=${this.classId}&className=${this.topName}`,
							success: res => {},
							fail: () => {},
							complete: () => {}
						})
					}

				} else {
					uni.navigateTo({
						url: `${item.path}`,
						success: res => {},
						fail: () => {},
						complete: () => {}
					})
				}

			}
		}
	}
</script>

<style>
	@font-face {
		font-family: 'iconfont';
		/* project id 3303366 */
		src: url('');
		src: url('?#iefix') format('embedded-opentype'),
			url('https://at.alicdn.com/t/font_3303366_3ied7mxip0t.woff2') format('woff2'),
			url('https://at.alicdn.com/t/font_3303366_3ied7mxip0t.woff') format('woff'),
			url('https://at.alicdn.com/t/font_3303366_3ied7mxip0t.ttf') format('truetype'),
			url('#iconfont') format('svg');
	}

	.bottomContent {
		position: fixed;
		bottom: 0rpx;
		left: 0rpx;
		box-shadow: 10rpx 0rpx 10rpx 0rpx #8F8F94;
		width: 100%;
		height: 0rpx;
		background-color: white;
		z-index: 99999
	}

	.bottom_nav_wrap {
		width: 750rpx;
		height: 80rpx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px -1rpx 10rpx 0rpx rgba(104, 57, 182, 0.2);
		display: flex;
		justify-content: space-around;
		align-content: space-between;
		position: fixed;
		bottom: 0;
		left: 0;
		padding-top: 18rpx;
		padding-bottom: 20rpx;
	}

	.bottom_nav_content {
		display: flex;
		flex-direction: column;
		align-items: center;

	}

	.select-color {
		color: blue !important;
	}

	.bottom-nav-text {
		font-size: 32rpx;
		color: rgba(161, 161, 161, 1);
	}

	.bottom_nav_font {
		font-size: 32rpx;
		font-family: Source Han Serif SC;
		font-weight: bold;
		color: blue;
		line-height: 24rpx;
		margin-top: 20rpx;
		/* margin-left:-3rpx; */
	}

	.bottom_nav_font_cancel {
		font-size: 32rpx;
		font-family: Source Han Serif SC;
		font-weight: bold;
		color: rgba(161, 161, 161, 1);
		line-height: 24rpx;
		margin-top: 20rpx;
		/* margin-left:-3rpx; */
	}
</style>
